<template>
  <view id="all">
    <view id="top">
      <view id="text">
        <text>14:03</text> <br>
        <text>补补超市为您服务</text>
      </view>
    </view>
    <view id="bottom">
      <view id="input">
        <input type="text">
      </view>      
      <view id="button">
        <button>发送</button>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name:"zxkf"
}
</script>

<style scoped>
#all{
  width: 100%;
  height: 35rem;
  margin: auto;
  display: flex;
  flex-direction:column;
  justify-content: space-between;
  background-color: rgb(237, 240, 241)
}
#top{
  text-align: center;
}
#text{
  padding: 2rem 0;
}
#bottom{
  display: flex;
  justify-content: space-around;
  background-color: rgb(248, 248, 248);
  height: 4rem;
  align-items:center;
}
#input input{
  width: 15rem;
  background-color: white;
  height: 3rem;
  border-radius: 0.5rem;
}
#button button{
  width: 5rem;
  height: 3rem;
  text-align: center;
}
</style>
